<a name="group-{{:rebind:group.hash}}"></a>
<div id="group-{{:rebind:group.hash}}"
          class="item item-icon-right item-avatar {{::ionItemClass}} ink"
          ng-click="select(group)">

  <i class="item-image avatar" style="background-image: url({{::group.avatar.src}})" ng-if="group.avatar"></i>
  <i class="item-image icon ion-android-people" ng-if="!group.avatar"></i>
  <i class="item-image icon-secondary ion-android-lock" ng-if="!group.avatar" style="left: 20px; top: 17px; font-size: 19px; color: #d9d9d9;"></i>

  <h2 ng-bind-html=":rebind:group.title"></h2>

  <!-- creation time-->
  <h4 class="gray pull-right">
    <i class="ion-clock"></i>
    {{:rebind:'GROUP.CREATED_TIME'|translate: group }}
  </h4>

  <!-- membersCount -->
  <h4 class="dark pull-left" ng-if=":rebind:group.membersCount">
    <i class="dark ion-person"></i>
    <span class="dark">+{{:rebind:group.membersCount}}</span>
  </h4>

  <i class="icon ion-ios-arrow-right"></i>
</div>
